<template>
	<view>
		<u-popup
			v-model="show"
			mode="center"
			:mask="true"
			:popup="false"
			:closeable="false"
			:maskCloseAble="false"
			:safeAreaInsetBottom="true"
			:z-index="zIndex"
			:borderRadius="20"
			close-icon-color="#2B85E4"
			@close="success"
		>
			<view class="u-p-20">
				<view class="u-p-10">微信服务号登录</view>
				<view class="u-p-40 u-m-t-40 u-text-center" style="width:80vw;">
					<u-icon name="weixin-fill" color="#1aad19" size="220"></u-icon>
					<button type="primary" class="u-m-t-40" @click="getUserInfo">微信授权登录</button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
/**
 * m-login-weixin 公众号登录组件
 * @property {string} success 成功后返回的数据
 * @property {String} z-index 弹出时的z-index值
 */
export default {
	name: 'm-login-weixin',
	props: {
		zIndex: {
			type: [String, Number],
			default: 0
		}
	},
	data() {
		return {
			user: {},
			show: false,
			reject: null,
			resolve: null
		};
	},
	methods: {
		// 本地用户数据
		local() {
			return new Promise((resolve, reject) => {
				this.reject = reject;
				this.resolve = resolve;
				this.$u.login.local().then(
					ret => {
						this.user = ret;
						this.success();
					},
					ret => {
						this.user = {};
						this.show = true;
					}
				);
			});
		},
		// 重载用户数据
		reload() {
			return new Promise((resolve, reject) => {
				this.reject = reject;
				this.resolve = resolve;
				this.$u.login.reload().then(
					ret => {
						this.user = ret;
						this.success();
					},
					ret => {
						this.user = {};
						this.show = true;
					}
				);
			});
		},
		// 登录成功返回
		success() {
			this.show = false;
			this.resolve(this.user);
			this.$emit('success', this.user);
		},
		// 尝试重新登录
		getUserInfo(e) {
			location.reload();
		}
	}
};
</script>

<style lang="scss" scoped></style>
